<template>
	<view class="page prize">
		<view class="container">
			<draw-details :info="drawInfo"></draw-details>
			<draw-help ref="help" :info="drawInfo" v-if="isPartake"></draw-help>
			<draw-winning :code="winningInfo" :info="drawInfo" v-if="drawInfo.isLottery"></draw-winning>
			<draw-participant ref="participant" @refresh="refresh" :info="drawInfo" :shareUserId="shareUserId"></draw-participant>
			<form @submit="setFormId" report-submit="true" class="container-item mc-flex-center">
				<button form-type="submit" type="primary" hover-class="none" @tap="moreDraw">参与更多</button>
			</form>
			<view class="margin-bottom36"><banner-ad></banner-ad></view>
			<form @submit="setFormId" report-submit="true" v-if="showHome">
				<button form-type="submit" @tap="toHome" class="formId-btn" style="width: 150rpx;position: fixed;right: 0;bottom: 100rpx;z-index: 1000;">
					<image src="../../../static/images/to_home_index.png" mode="widthFix" class="mc-db pct100"></image>
				</button>
			</form>
		</view>
		<c-pop></c-pop>
	</view>
</template>

<script>
import { mapGetters, mapActions } from 'vuex';
import drawDetails from '@/components/home/draw-details/index.vue';
import drawParticipant from '@/components/home/draw-participant/index.vue';
import drawHelp from '@/components/home/draw-help/index.vue';
import drawWinning from '@/components/home/draw-winning/index.vue';
let _self;
export default {
	components: {
		drawDetails,
		drawParticipant,
		drawHelp,
		drawWinning
	},
	data() {
		return {
			prizeId: '',
			shareUserId: '',
			drawInfo: {},
			winningInfo: {},
			drawUserList: [],

			showHome: false,
			InterstitialAd: null
		};
	},
	computed: {
		...mapGetters('user', ['_isLogin', '_gameInfo']),
		isPartake: function() {
			return this.drawInfo.isPartake ? true : false;
		}
	},
	methods: {
		...mapActions('user', ['gameInfoUp']),
		...mapActions('draw', ['luckyCodeListUp', 'participantListUp']),
		refresh() {
			this.getDetails();
			const pages = getCurrentPages();
			if (pages.length > 1 && pages[pages.length - 2] && pages[pages.length - 2].route.indexOf('pages/tabBar/draw/index') >= 0) {
				pages[pages.length - 2].$vm.loadList();
			}
		},
		// 抽奖详情
		async getDetails() {
			let res =
				(await this.$api.draw.getDrawDetails({
					prizeId: this.prizeId
				})) || {};
			console.log(res);

			const prizeInfoDto = res.prizeInfoDto || {};
			if (prizeInfoDto.lotteryTime) {
				const arr = this.$util.formatTimestamp(prizeInfoDto.lotteryTime);
				prizeInfoDto.lotteryTime = arr[1] + '月' + arr[2] + '日 ' + arr[3] + ':' + arr[4];
			}
			this.drawInfo = prizeInfoDto || {};

			const drawUserDto = res.drawUserDto || {};
			drawUserDto.title = prizeInfoDto.prizeName + '×' + prizeInfoDto.prizeAmount;
			this.winningInfo = drawUserDto;

			if (!this.drawInfo.isPartake) {
				uni.hideShareMenu();
			}
			qq.nextTick(() => {
				console.log('getDrawCodeList---------------------------');
				if (this.drawInfo.isPartake) this.$refs.help.getDrawCodeList();
			});
		},
		islogin() {
			console.log('_isLogin', this._isLogin);
			if (!this._isLogin) {
				uni.reLaunch({
					url: '/pages/authorize/index'
				});
			} else if (!this._gameInfo) {
				this.gameInfoUp();
			}
		},
		moreDraw() {
			uni.switchTab({
				url: '/pages/tabBar/draw/index'
			});
		},
		isShowHomeBtn() {
			this.showHome = getCurrentPages().length == 1;
		},
		toHome() {
			uni.switchTab({
				url: '/pages/tabBar/home/index'
			});
		},
		//创建插屏广告
		async createInterstitialAd() {
			const pageName = 'drawDetails';
			if (!this.InterstitialAd || this._pageName != pageName) {
				await this.$store.dispatch('InterstitialAd/destroy');
				this.InterstitialAd = qq.createInterstitialAd({
					adUnitId: '1e9e1454c766205f778256de22e4bebf'
				});
				this.$store.dispatch('InterstitialAd/init', {
					InterstitialAd: this.InterstitialAd,
					pageName
				});
			}
		},
		// ---------------------------------------
		// 保存二维码
		setFormId(e) {
			this.$store.dispatch('common/formIdListUp', {
				e: e,
				isSave: true
			});
		}
	},
	onLoad(options) {
		console.error('onLoad options:' + JSON.stringify(options));
		this.$store.dispatch('common/enterUrlUp', {
			query: options,
			path: 'pages/draw/details/details'
		});

		_self = this;
		this.prizeId = options.prizeId || '';
		this.shareUserId = options.shareUserId || ''; // '164772879681536';
		this.isShowHomeBtn();
		this.islogin();
		this.getDetails();
		this.$refs.participant.getDrawUserList(this.prizeId);
	},
	onShow() {
		this.createInterstitialAd();
	},
	// 下拉刷新
	onPullDownRefresh() {
		this.getDetails();
		this.$refs.participant.getDrawUserList(this.prizeId);
		uni.stopPullDownRefresh();
	},
	onShareAppMessage(res) {
		const num = Math.floor(Math.random() * 6 + 1);
		console.log(num);
		if (res.from === 'button') {
			// 来自页面内分享按钮
			console.log(res.target);
		}
		return {
			title: '快来抢！这里免费送你' + this.drawInfo.prizeName + '皮肤一套，先到先得',
			path: '/pages/draw/details/details?shareUserId=' + this._gameInfo.userId + '&prizeId=' + this.prizeId,
			imageUrl: this.drawInfo.shareImgUrl
		};
	}
};
</script>

<style lang="scss" scoped>
.prize {
	background-color: #581ae1;
	color: #555555;
	font-size: 32rpx;

	.container {
	}

	.container-item {
		position: relative;
		width: 690rpx;
		margin: 30rpx auto;
		z-index: 9;
		border-radius: 10rpx;
		padding: 10rpx;

		button {
			width: 600rpx;
			background-color: #1ac97c;
			border-radius: 1000px;
		}
	}
}
</style>
